<template>
	<view>
        <view class="status_bar"></view>
		<view class="header-bar">
            <image src="../../static/images/avatar.76a75b8f17.png" mode=""></image>
            <navigator url="../login/login">
                <text>登录/注册</text>
            </navigator>
        </view>
        <view class="order-row flex-row more-right">
            <text>我的订单</text>
            <text>全部订单</text>
        </view>
        <view class="service-row flex-row">
            <view class="item flex-col">
                <view class="icon"></view>
                <text>待付款</text>
            </view>
            <view class="item flex-col">
                <view class="icon"></view>
                <text>待收货</text>
            </view>
            <view class="item flex-col">
                <view class="icon"></view>
                <text>退换修</text>
            </view>
        </view>
        
        
	</view>
</template>

<script>
export default {
    name:"MyHeader",
    data() {
        return {
            
        }
    },
    methods: {
        
    },
}
</script>

<style lang="stylus" scoped>
    .header-bar
        display flex
        align-items center
        height 166rpx
        width 100%
        box-sizing border-box
        padding-left 38rpx
        background url('https://m.mi.com/static/img/bg.63c8e19851.png') center #f37d0f
        background-size cover
        image
            width: 100rpx;
            height: 100rpx;
            overflow: hidden;
            box-sizing: border-box;
            border-radius: 100%;
            border: 3px solid hsla(0,0%,100%,.4);
            text-align: center;
            margin-right 17rpx
        text
            color: #fff;
            font-size: 26rpx;
    .order-row
        height 81rpx
        padding-left 32rpx
        background-color #fff
        border-bottom 2rpx solid rgba(0,0,0,.15)
        text
            &:nth-child(1)
                font-size 30rpx
    .service-row
        height 176rpx
        padding  0 83.2rpx
        background-color #fff
        margin-bottom 21rpx
        .item
            font-size 24rpx
            .icon
                width 50rpx
                height 50rpx
                margin-bottom 16rpx
            &:nth-child(1)
                .icon
                    background url('') no-repeat center 0
                    background-size cover
            &:nth-child(2)
                .icon
                    background url('') no-repeat center 0
                    background-size cover
            &:nth-child(3)
                .icon
                    background url('../../static/images/nav-4.d68723895f.png') no-repeat center 0
                    background-size cover
</style>
